/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Image,
    Dimensions,
    ScrollView,
    Platform,
    TouchableOpacity
} from 'react-native';
import NavigationBar from '../components/NavigationBar'
const {height, width} = Dimensions.get('window');
export default class YuYueXiangQing extends Component {
    render() {
        return (
            <View style={styles.container}>
                <NavigationBar 
                     titleText="预约详情"
                     leftIcon = 'left'
                     leftPress={()=>this.goBack()}
                     leftStyle={{tintColor:"#fff"}}/>
                <ScrollView>
                    <View style={styles.tua}>
                        <Image style={styles.tu} source={require('../img/logo.png')}/>
                    </View>
                    <View style={styles.ming}>
                        <Text>预约用户名</Text>
                        <Text>哈哈</Text>
                    </View>
                    <View style={styles.ming}>
                        <Text>宠物品种</Text>
                        <Text>金毛</Text>
                    </View>
                    <View style={styles.ming}>
                        <Text>预约时间</Text>
                        <Text>17.01.01-17.02.02</Text>
                    </View>
                    <View style={styles.ming}>
                        <Text>用户联系方式</Text>
                        <Text>12345678</Text>
                    </View>
                    <View style={styles.ming}>
                        <Text>预约项目</Text>
                        <Text>狗狗洗澡</Text>
                    </View>
                    <View style={styles.ming}>
                        <Text>用户留言</Text>
                        <Text>等待</Text>
                    </View>
                </ScrollView>
            </View>
        );
    }
    goBack(){
        this.props.navigation.goBack();
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        flexDirection:'column',
        alignItems: 'stretch',
        ...Platform.select({
            ios: {
                marginTop: 20
            },
            android: {
                marginTop:0
            },

        }),
    },
    tua:{
        width:width,
        alignItems:"center",
        justifyContent:"center",
        marginTop:20,
        marginBottom:20,
    },
    tu:{
        width:66,
        height:66,
    },
    ming:{
        width: width,
        height: 50,
        backgroundColor:"#fff",
        flexDirection:"row",
        justifyContent:"space-between",
        borderBottomWidth:1,
        borderColor:"#eee",
        paddingLeft:14,
        paddingRight:14,
        alignItems:"center",
    }
});

